BUGFIX: Prevent warnings for unrecognized DOM props #3895
Conversation
This change addresses React warnings related to invalid DOM attributes: - Removed `executeCommand` and `formattingUnderCursor` from being passed to DOM elements. - Ensured these props are only handled within components where they are relevant, preventing them from being incorrectly rendered on DOM elements. These update prevent unnecessary warnings in the console. Resolves: neos#3894
| @@ -41,6 +41,11 @@ export default richtextToolbarRegistry => { | |||
| [callbackPropName]: e => e.stopPropagation() || executeCommand(commandName, ...commandArgs) | |||
| }; | |||
|
|
|||
| // filter out props that are not needed by the component and lead to a render warning | |||
| if (commandName === 'code') { | |||
There was a problem hiding this comment.
why does this have to be conditionally wrapped? And what does code mean?
There was a problem hiding this comment.
The component that is used for the code command (class U) is not using the two props, and they end up in the DOM and that leads to the issue. In other places, we also omit properties to prevent that they end up in the IconButtons of the toolbar.
There was a problem hiding this comment.
Does it mean the "code" Dom element specifically or some CK internal thing?
If it's a CK internal, a reference in the comment would be great. Like this it just looks like a random magic string.
There was a problem hiding this comment.
The formatting type code comes from CKEditor and we just pass thru the props to the components.
There was a problem hiding this comment.
We actually use just code. But the newer CKEditor also has codeBlock, but we just don`t have it yet.
This change addresses React warnings related to invalid DOM attributes:
executeCommandandformattingUnderCursorfrom being passed to DOM elements.These update prevent unnecessary warnings in the console.
Resolves: #3894